<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>Prototype extension: Showcase | Diagonal example</title>	
	<link rel="stylesheet" type="text/css" href="showcase.css" />
	<script type="text/javascript" src="prototype.js"></script>
	<script type="text/javascript" src="effects.js"></script>
	<script type="text/javascript" src="showcase.js"></script>
</head>
<body>	
	<div class="showcase" id="diagonal">
		<a href="#previous" class="controls previous" rel="previous">&ndash;</a>
		<a href="#next" class="controls next" rel="next">+</a>
		<ul>
         <li><a herf="#" title="Samuel SZONIECKY "><img src="https://lh3.googleusercontent.com/-BUqkI5EmDik/Tom9Lj1Tt-I/AAAAAAAAAFg/L796QzkyRXw/s457/2011-10-03%25252015.29.33.jpg" alt="https://lh3.googleusercontent.com/-BUqkI5EmDik/Tom9Lj1Tt-I/AAAAAAAAAFg/L796QzkyRXw/s457/2011-10-03%25252015.29.33.jpg" style="cursor: -moz-zoom-out" ></a></li>
         <li><a herf="#" title="Claude YACOUB "><img src="https://lh5.googleusercontent.com/-NyesxTcpGL8/Tom9LzfYgWI/AAAAAAAAAFg/Ckcp7HzMOyg/s512/2011-10-03%25252015.29.45.jpg" alt="https://lh5.googleusercontent.com/-NyesxTcpGL8/Tom9LzfYgWI/AAAAAAAAAFg/Ckcp7HzMOyg/s512/2011-10-03%25252015.29.45.jpg" style="cursor: -moz-zoom-out" ></a></li>
         
         <li><a href="#" title="Ala ATRASH "><img src="https://lh5.googleusercontent.com/-zADcPTs-mrQ/Tom9M4WQiZI/AAAAAAAAAFg/BgIg6iBS3Yo/s512/2011-10-03%25252015.30.22.jpg" alt="https://lh5.googleusercontent.com/-zADcPTs-mrQ/Tom9M4WQiZI/AAAAAAAAAFg/BgIg6iBS3Yo/s512/2011-10-03%25252015.30.22.jpg" style="cursor: -moz-zoom-out" ></a></li>
         
		<li><a href="#" title="Rosa LAKROUZ "><img src="https://lh5.googleusercontent.com/-UzALKQhdu_E/Tom9NpxZpwI/AAAAAAAAAFg/-FXS7W61O9Y/s512/2011-10-03%25252015.31.35.jpg" alt="https://lh5.googleusercontent.com/-UzALKQhdu_E/Tom9NpxZpwI/AAAAAAAAAFg/-FXS7W61O9Y/s512/2011-10-03%25252015.31.35.jpg" style="cursor: -moz-zoom-out"></a></li>
        <li><a href="#" title="fathi GHROUL"><img src="https://lh3.googleusercontent.com/-AfIBaysgd9Y/Tom9NOmFJ3I/AAAAAAAAAFg/-jzfIMh3s8g/s512/2011-10-03%25252015.31.15.jpg" alt="https://lh3.googleusercontent.com/-AfIBaysgd9Y/Tom9NOmFJ3I/AAAAAAAAAFg/-jzfIMh3s8g/s512/2011-10-03%25252015.31.15.jpg" style="cursor: -moz-zoom-in" width="353" height="354" ></a></li>
        <li><a href="#" title="Wael Klouz"><img src="https://lh5.googleusercontent.com/-_ehsU8Li6rc/Tom9MZFS3zI/AAAAAAAAAGU/RDANRn3Ep-c/s512/2011-10-03%25252015.30.08.jpg" alt="https://lh5.googleusercontent.com/-_ehsU8Li6rc/Tom9MZFS3zI/AAAAAAAAAGU/RDANRn3Ep-c/s512/2011-10-03%25252015.30.08.jpg" style="cursor: -moz-zoom-out" width="353" height"354"></a></li>
  
         
			<li><a href="#" title="Kahina AZAOUN1"><img src="https://lh3.googleusercontent.com/-0d7eP4zj2P4/Tom9N4myItI/AAAAAAAAAFg/EPszv5XQfXM/s512/2011-10-03%25252015.31.50.jpg" alt="https://lh3.googleusercontent.com/-0d7eP4zj2P4/Tom9N4myItI/AAAAAAAAAFg/EPszv5XQfXM/s512/2011-10-03%25252015.31.50.jpg" style="cursor: -moz-zoom-out"></a></li>
			<li><a href="#" title="Sara MANSOURI"><img src="https://lh4.googleusercontent.com/-_7KQgf1MPi4/Tom9OVqZptI/AAAAAAAAAFg/n6Ba18vfTbY/s512/2011-10-03%25252015.32.06.jpg" alt="https://lh4.googleusercontent.com/-_7KQgf1MPi4/Tom9OVqZptI/AAAAAAAAAFg/n6Ba18vfTbY/s512/2011-10-03%25252015.32.06.jpg" style="cursor: -moz-zoom-out"></a></li>
			<li><a href="#" title="Chaimae ALAMI MCHICHI"><img src="https://lh6.googleusercontent.com/-0JkiuFKOaL8/Tom9Otama6I/AAAAAAAAAFg/qrUI9iJgDCg/s512/2011-10-03%25252015.32.23.jpg" alt="https://lh6.googleusercontent.com/-0JkiuFKOaL8/Tom9Otama6I/AAAAAAAAAFg/qrUI9iJgDCg/s512/2011-10-03%25252015.32.23.jpg" style="cursor: -moz-zoom-out"></a></li>
			<li><a href="#" title="Toktam ARAB SHEIBANI"><img src="https://lh4.googleusercontent.com/-y9Dvx0PrUss/Too7kE7d3HI/AAAAAAAAAF4/uRGJ1-MiW28/s512/_MG_4581.jpg" alt="https://lh4.googleusercontent.com/-y9Dvx0PrUss/Too7kE7d3HI/AAAAAAAAAF4/uRGJ1-MiW28/s512/_MG_4581.jpg" style="cursor: -moz-zoom-out" ></a></li>
			<li><a href="#" title="Ahlame AZAMI"><img src="https://lh3.googleusercontent.com/-hjkeaO0cB4Q/TpKkWv1uczI/AAAAAAAAAFg/CDVSBRg4tXE/s512/ah.jpg" alt="https://lh3.googleusercontent.com/-hjkeaO0cB4Q/TpKkWv1uczI/AAAAAAAAAFg/CDVSBRg4tXE/s512/ah.jpg" style="cursor: -moz-zoom-out"></a></li>
      	<li><a href="#" title="Dharar CHEHIDI"><img src="https://lh6.googleusercontent.com/--CpRGkZFuf8/TpKirJG_OjI/AAAAAAAAAFg/WiSRxZAk2aE/s512/2011-10-10%25252009.42.22.jpg" alt="https://lh6.googleusercontent.com/--CpRGkZFuf8/TpKirJG_OjI/AAAAAAAAAFg/WiSRxZAk2aE/s512/2011-10-10%25252009.42.22.jpg" style="cursor: -moz-zoom-out" ></a></li>
        	<li><a href="#" title=" Racha AMIN"><img src="https://lh3.googleusercontent.com/-QO8Phu1i5MM/TpxbpV8NHrI/AAAAAAAAAH4/Lt98f9Lr3tE/s512/2011-10-17%25252011.42.22.jpg" alt="https://lh3.googleusercontent.com/-QO8Phu1i5MM/TpxbpV8NHrI/AAAAAAAAAH4/Lt98f9Lr3tE/s512/2011-10-17%25252011.42.22.jpg" style="cursor: -moz-zoom-out"></a></li>
            	<li><a href="#" title="Slide 6"><img width="354" height="354" src="https://lh6.googleusercontent.com/-GdGPDfU6BL4/TpKfUZua3_I/AAAAAAAAAFg/V_hmQNCsqaQ/s512/2011-10-10%25252009.15.32.jpg" alt="https://lh6.googleusercontent.com/-GdGPDfU6BL4/TpKfUZua3_I/AAAAAAAAAFg/V_hmQNCsqaQ/s512/2011-10-10%25252009.15.32.jpg" style="cursor: -moz-zoom-in"></a></li>
                <li><a href="#" title="Slide 6"><img src="https://lh5.googleusercontent.com/-PFLLK-nrh4Y/TpREDlDG5gI/AAAAAAAAAGs/Y9JlCOqN8J4/s512/2011-10-10%25252015.16.24.jpg" alt="https://lh5.googleusercontent.com/-PFLLK-nrh4Y/TpREDlDG5gI/AAAAAAAAAGs/Y9JlCOqN8J4/s512/2011-10-10%25252015.16.24.jpg" style="cursor: -moz-zoom-out"></a></li>
		</ul>
	</div>	
	<script type="text/javascript">
		document.observe('dom:loaded', function () {
			new Showcase.Diagonal($$('#diagonal ul li'), $$('#diagonal a.controls'), {duration: 0.3});
			});
	</script>
</body>
</html>
